<template>
    <div class="item">
        <div class="top">
            <div class="time">{{data.addTime}}</div>
            <p>交易完成</p>
        </div>
        <div class="center">
            <img src="@/assets/goods1.jpg" alt="">
            <p>实付：<span>￥{{data.sum}}</span></p>
        </div>
        <!-- <div class="bottom">
            <p>删除</p>
        </div> -->
    </div>
</template>

<script>
    export default {
        name:"Item-Order",
        props:['data']
    }
</script>

<style scoped lang="less">
    .item{
        background: #fff;
        border-radius: 2.7vw;
        box-shadow: 0vw 0.8vw 1.3vw 0.8vw rgba(0, 0, 0, 0.062);
        padding: 1.3vw 2.7vw 2.7vw 2.7vw;
        margin-bottom: 5.3vw;

        .top{
            display: flex;
            font-size: 3.2vw;
            justify-content: space-between;
            color: #333;
            padding: 2.7vw 0;
            border-bottom: 0.3vw solid rgb(240, 240, 240);
        }

        .center{
            margin: 2.7vw 0;
            display: flex;
            align-items: baseline;
            justify-content: space-between;
             img{
                width: 16vw;
                height: 16vw;
             }

             p{
                font-size: 3.7vw;
                span{
                    font-size: 4.3vw;
                    font-weight: 600;
                    color: red;
                }
             }
        }
    }
</style>